<template>

    <el-button size="default" type="default" @click="backToList()">返回</el-button>
    <el-button size="default" type="default" @click="getDetail()">获取数据</el-button>
    <el-form
            ref="reqParam"
            label-width="120px"
            class="demo-ruleForm"
            size="default"
            status-icon
    >
        <el-form-item label="名称" prop="name">
            <el-input v-model="dataDetail.name" />
        </el-form-item>
        <el-form-item label="标签" prop="type">
            <i v-for="item in tagList">
                <input type="checkbox" :id="item.id" v-model="tagIdList" :value="item.id" />
                <label :for="item.id">{{ item.name }}</label>
            </i>
        </el-form-item>
        <el-form-item label="价格" prop="number">
            <el-input v-model="dataDetail.price" />
        </el-form-item>
        <el-form-item label="发行商" prop="name">
            <el-input v-model="dataDetail.author" />
        </el-form-item>
        <el-form-item label="开售时间" prop="name">
            <el-input v-model="dataDetail.saleTime" />
        </el-form-item>
        <el-form-item label="大小" prop="name">
            <el-input v-model="dataDetail.size" />
        </el-form-item>
        <el-form-item label="平台" prop="name">
            <el-input v-model="dataDetail.platform" />
        </el-form-item>

        <el-form-item label="简介" prop="desc">
            <el-input v-model="dataDetail.introduction" type="textarea" />
        </el-form-item>


        <el-upload
                v-model:file-list="dataDetail.fileList"
                action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
                list-type="picture-card"
                :on-preview="wait"
                :on-remove="wait"
        >
            <el-icon><Plus /></el-icon>
        </el-upload>
        <!--上传-->
        <el-dialog v-model="dataDetail.fileList">
            <!--            <img w-full :src="dialogImageUrl" alt="Preview Image" />-->
            <img :src="wait" alt="图片" />
        </el-dialog>


        <el-form-item>
            <el-button type="primary" @click="save()">
                保存
            </el-button>
            <el-button @click="getDetail()">
                重置
            </el-button>
        </el-form-item>
    </el-form>
  <!--  {{ reqParam }}-->


</template>

<script setup>

import { ref } from 'vue'
import {Plus} from "@element-plus/icons-vue";
import {changeStatus, getPostList} from "@/api/request";
import {ElMessage} from "element-plus";
import {useRoute, useRouter} from "vue-router";

const router = useRouter()
const route = useRoute()

const loginUserId = ref("")
const loginUserName = ref("")

const tagIdList = ref([])

const typeMap = ref(new Map([
    ['1', "求助"],
    ['2', "教程"],
    ['3', "讨论"],
    ['4', "分享"],
    ['5', "其他"]
]))

const platformMap = ref(new Map([
    ['Steam', 'Steam'],
    ['Epic', 'Epic'],
    ['WeGame', 'WeGame'],
    ['Origin', 'Origin'],
    ['AppStore', 'AppStore'],
    ['暴雪游戏', '暴雪游戏'],
    ['微软游戏商店', '微软游戏商店'],
    ['MicrosoftStore', 'MicrosoftStore'],
    ['RockStar', 'RockStar'],
    ['GOG', 'GOG'],
    ['其它', '其它']
]))

const reqParam = ref({
    loginUserId: "",
    loginUserName: "",
    creatorId: "",
    creatorName: "",
    gmtCreateTime: "",
    modifierId: "",
    modifierName: "",
    gmtModifyTime: "",
    id: "",
    title: "",
    type: "",
    content: "",
    tagIds: "",
    tagIdList: [],
    fileUrls: "",
    fileUrlList: [],
    status: "",
    backReason: "",
    saveType: ""
})

const dataDetail = ref({
    id: "1",
    name: "222",
    tags: "",
    tagList: [
        {
            id: "1",
            name: "dw",
            type: "dw",
            hotCount: 0,
            creatorId: "",
            creatorName: "",
            gmtCreateTime: "",
            modifierId: "",
            modifierName: "",
            gmtModifyTime: ""
        }
    ],
    tagIdList: [],
    price: 0.0,
    author: "",
    platform: "",
    size: "",
    saleTime: "",
    status: "",
    introduction: "",
    creatorId: "",
    creatorName: "",
    gmtCreateTime: "",
    modifierId: "",
    modifierName: "",
    gmtModifyTime: ""
})

const tagList = ref([])

async function getTagList() {
    let resp = await getPostList(
        {
            type: "1",
            pageNum: 1,
            pageSize: 99999
        },
        "/tag/list"
    )
    console.log(resp)
    tagList.value = resp.list
}

async function getDetail() {
    await getTagList()

    let resp = await getPostList({
        // id: id.values()
        id: route.params.id
    }, "/game/detail")
    console.log(resp)
    dataDetail.value = resp.data

}

async function save() {
    dataDetail.value.tagIdList = tagIdList.value

    let resp = await getPostList(dataDetail.value, "/game/update")
    if (resp.code === 200) {
        ElMessage.success("保存成功")
    }else {
        ElMessage.error("保存失败")
    }

}
function backToList() {
    router.back()
}


async function limit(reqId, reqStatus) {
    let resp = await changeStatus(
        {
            id: reqId,
            status: reqStatus
        }, "/game/update"
    )
    console.log(resp)
    if (resp.code === 200) {
        ElMessage.success("更新成功")
    }else {
        ElMessage.error("更新失败")
    }
}

function wait() {
    ElMessage.info("功能开发中，敬请期待....")
}


</script>


<style scoped>

</style>